<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <div th:replace="admin/head :: head"></div>
    <title>套餐表单</title>
</head>

<body>
<div class="x-body layui-anim layui-anim-up">
    <form class="layui-form">
        <input type="hidden" name="id" th:value="${orderCombo eq null ? '' : orderCombo.id}"/>

        <div class="layui-form-item">
            <label for="L_label" class="layui-form-label">
                套餐选项
            </label>
            <div class="layui-input-inline width-30">
                <input type="text" id="L_label" name="label" required="" lay-verify="required" autocomplete="off"
                       class="layui-input" th:value="${orderCombo eq null ? '' : orderCombo.label}">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>
            </div>
        </div>

        <div class="layui-form-item">
            <label for="L_value" class="layui-form-label">
                套餐选项值
            </label>
            <div class="layui-input-inline width-30">
                <input type="text" id="L_value" name="value" required="" lay-verify="required" autocomplete="off"
                       class="layui-input" th:value="${orderCombo ne null ? orderCombo.value : ''}">
            </div>
        </div>

        <div class="layui-form-item">
            <label for="L_price" class="layui-form-label">
                套餐价格
            </label>
            <div class="layui-input-inline">
                <input type="text" id="L_price" name="price" required="" lay-verify="required" autocomplete="off"
                       class="layui-input" th:value="${orderCombo eq null ? '' : orderCombo.price}">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>
            </div>
        </div>

        <div class="layui-form-item">
            <label for="L_city" class="layui-form-label">
                套餐城市
            </label>
            <div class="layui-input-inline width-50">
                <select class="layui-input" id="L_city" name="city">
                    <option value="">请选择</option>
                    <option th:each="item, index:${areas}" th:value="${item.id}" th:text="${item.name}"
                            th:selected="${orderCombo ne null ? (item.id eq orderCombo.city) : false}"></option>
                </select>
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>
            </div>
        </div>

        <div class="layui-form-item">
            <label for="L_group" class="layui-form-label">
                套餐组
            </label>
            <div class="layui-input-inline">
                <input type="text" id="L_group" name="group" required="" lay-verify="required" autocomplete="off"
                       class="layui-input" th:value="${orderCombo eq null ? '' : orderCombo.group}">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>
            </div>
        </div>

        <div class="layui-form-item">
            <label for="L_groupName" class="layui-form-label">
                套餐组名
            </label>
            <div class="layui-input-inline">
                <input type="text" id="L_groupName" name="groupName" required="" lay-verify="required"
                       autocomplete="off"
                       class="layui-input" th:value="${orderCombo eq null ? '' : orderCombo.groupName}">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>
            </div>
        </div>

        <div class="layui-form-item">
            <label for="L_tag" class="layui-form-label">
                套餐标签
            </label>
            <div class="layui-input-inline">
                <input type="text" id="L_tag" name="tag" required="" lay-verify="required" autocomplete="off"
                       class="layui-input" th:value="${orderCombo eq null ? '' : orderCombo.tag}">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>
            </div>
        </div>

        <div class="layui-form-item">
            <label for="L_tagName" class="layui-form-label">
                套餐标签名
            </label>
            <div class="layui-input-inline">
                <input type="text" id="L_tagName" name="tagName" required="" lay-verify="required" autocomplete="off"
                       class="layui-input" th:value="${orderCombo eq null ? '' : orderCombo.tagName}">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>
            </div>
        </div>

        <div class="layui-form-item">
            <label for="L_columnText" class="layui-form-label">
                内容
            </label>
            <div class="layui-input-inline">
                <input type="text" id="L_columnText" name="columnText" autocomplete="off"
                       class="layui-input" th:value="${orderCombo eq null ? '' : orderCombo.columnText}">
            </div>
        </div>

        <div class="layui-form-item">
            <button class="layui-btn" type="button" lay-filter="add" lay-submit="">
                保存
            </button>
        </div>
    </form>
</div>

<script>
    layui.use(['form', 'layer', 'upload'], function () {
        $ = layui.jquery;
        var form = layui.form;

        //监听提交
        form.on('submit(add)', function (data) {
            $.ajax({
                type: 'post',
                url: '/admin/combo/api/save',
                data: data.field,
                dataType: 'json',
                beforeSend : function(xhr) {
                    xhr.setRequestHeader($("meta[name='_csrf_header']").attr("content"), $("meta[name='_csrf']").attr("content"));
                },
                success: function(result) {
                    if(result.status == 200) {
                        layer.alert(Messages.SUCCESS, {icon: 6}, function () {
                            // get frame index
                            var index = parent.layer.getFrameIndex(window.name);
                            // refresh parent list and close current dialog
                            parent.location.reload();
                            parent.layer.close(index);
                        });
                    } else {
                        layer.alert(result.error == null || result.error == undefined ? Messages.ERROR : result.error, {icon: 1});
                        return false;
                    }
                },
                error: function(e) {
                    layer.alert(Messages.ERROR, {icon: 1});
                }
            })
            return false;
        });
    });
</script>

</body>
</html>